import React from 'react';
import PropTypes from "prop-types";
import Button from "./Button";
import {useLocation} from "react-router-dom";

const Header = ({title,onAdd,showAdd}) => {

  const location = useLocation();

  return (
    <header>
      <h1>{title}</h1>
      {location.pathname === '/' && <Button onClick={onAdd} color={showAdd ? 'red' : 'green'} text={showAdd ? "close" : "add"}/>}
    </header>
  );

};

//注意写这个idea没有提示，但是是对的
Header.defaultProps = {
  title: "Task Tracker"
}

const headingStyle = {
  color:'red',
  backgroundColor:'pink'
}

Header.propTypes = {
  title: PropTypes.string.isRequired
};




export default Header;
